
#goodRuku {
    overflow: hidden;
    //padding: 30px;
}

.rukuList {
    background-color: white;
    width: 100%;
    margin: 30px auto 0;
    padding: 10px;
    //border: grey solid 1px;
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start;
    //justify-content:space-around;
    //align-content:space-around;
}

.rukuGood {
    overflow: hidden;
    width: 200px;
    height: 200px;
    //box-shadow: 0 0 7px 1px grey;
    //border: grey solid 1px;
    margin: 15px 7px ;
    padding: 10px;
    position: relative;
}

.rukuImage{
    width: 130px;
    height: 130px;
    display: block;
    margin: 0 auto;
    border-radius: 5px;
}
.rukuPrice{
    text-align: center;
    width: 85px;
    position: absolute;
    left: 60px;
    top:140px;
    span:nth-child(1){
        font-size: 25px;
        color: #213dc0;
    }
    .span2{
        font-size: 12px;
    }
    //display: inline;
    //margin-left: 35px;
    //width: 100px;
}
@keyframes hover
{
    from {width: 130px;height: 130px;margin-left: 26px}
    to {width:70px;height: 70px;margin: 0}
}
@keyframes price-hover
{
    from {left: 60px;top:140px}
    to {left: 90px;top: 10px}
}
@keyframes data-hover
{
    from {margin-top: 60px;}
    to {margin-top: 10px;}
}

.rukuGood:hover{
    box-shadow: 0 0 7px 1px grey;
    div{
        animation: price-hover 0.5s;
        animation-fill-mode:forwards;
        transition: all linear 0.5s;
    }
    img{
        animation: hover 0.5s;
        animation-fill-mode:forwards;
        transition: all linear 0.5s;
    }
    .rukuData{
        animation: data-hover 0.5s;
        animation-fill-mode:forwards;
    }
    .yibiaozhu{
        display: none !important;
    }
}
.rukuData{
    margin-top: 60px;
    width: 100%;
    //border: #282c34 solid 1px;
    //margin-top: 7px;
    //transition: all linear 1s;
    span{
        white-space: normal;
        font-size: 12px;
    }
    p{
        font-size: 12px;
    }
    .rukuBox{
       display: flex;
        justify-content:space-around;
    }
}
.rukuKucun{
    width: 110px;
    margin-top: 10px;
    //border: #282c34 solid 1px;
}
.rukuBiaozhu{
    text-align: center;
    width: 60px;
    //border: #282c34 solid 1px;
    font-size: 15px;
    margin-top: 10px;

}
.yibiaozhu{
    line-height: 30px;
    text-align: center;
    position: absolute;
    top: 70px;
    left: 65px;
    height: 30px;
    width: 70px;
    //height: 26px;
    border-radius: 13px;
    background-color: rgba(255, 255, 255, 0.6);
}
